import React, { Component } from 'react';
import {
  StyleSheet, View, Platform, Text,
} from 'react-native';

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    return (
      <View style={styles.contain}>
        <View style={styles.childView}>
          <Text>{Platform.OS}</Text>
        </View>
      </View>
    );
  }
}
// Platform.OS在 iOS 上会返回ios，而在 Android 设备或模拟器上则会返回android
const styles = StyleSheet.create({
  contain: {
    backgroundColor: 'yellow',
    flex: 1,
  },
  childView: {
    marginHorizontal: 20, // 相同于同时设置marginLeft和marginRight
    // marginVertical相同于同时设置marginTop和marginBottom
    backgroundColor: 'lightblue',
    height: 80,
    overflow: 'scroll', // default: visible , ios上无法滚动，why?
    width: 300,
  },
});
export default MyComponent;
